'use client';

// 分享码列表组件
// REF: API-SHARE189-004@v1.0

import React from 'react';
import {
  Search,
  RefreshCw,
  Upload
} from 'lucide-react';

import { Button } from '@/components/ui/button';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from '@/components/ui/select';

import { ShareCodeListProps } from './types';
import { ShareCodeTable } from './ShareCodeTable';

interface ShareCodeListWithSearchProps extends ShareCodeListProps {
  onPreviewClick: () => void;
  onBatchImportClick: () => void;
}

export function ShareCodeList({
  shareList,
  loading,
  pagination,
  searchQuery,
  statusFilter,
  onSearchChange,
  onStatusFilterChange,
  onSearch,
  onPageChange,
  onViewDetail,
  onParse,
  onDelete,
  onImportToVirtualDisk,
  onRefresh
}: ShareCodeListProps) {
  return (
    <div className="space-y-4">
      {/* 分享码列表 */}
      <Card>
        <CardHeader>
          <div className="flex items-center justify-between">
            <CardTitle>分享码列表</CardTitle>
            <div className="flex items-center gap-2">
              <div className="flex items-center gap-2">
                <Input
                  placeholder="搜索分享码或描述..."
                  value={searchQuery}
                  onChange={(e) => onSearchChange(e.target.value)}
                  className="w-64"
                />
                <Select value={statusFilter} onValueChange={onStatusFilterChange}>
                  <SelectTrigger className="w-32">
                    <SelectValue placeholder="状态筛选" />
                  </SelectTrigger>
                  <SelectContent>
                    <SelectItem value="all">全部状态</SelectItem>
                    <SelectItem value="0">待解析</SelectItem>
                    <SelectItem value="1">解析中</SelectItem>
                    <SelectItem value="2">解析完成</SelectItem>
                    <SelectItem value="3">解析失败</SelectItem>
                    <SelectItem value="4">已导入</SelectItem>
                  </SelectContent>
                </Select>
                <Button variant="outline" size="sm" onClick={onSearch}>
                  <Search className="h-4 w-4" />
                </Button>
              </div>
              <Button onClick={onRefresh} disabled={loading} variant="outline" size="sm">
                <RefreshCw className={`h-4 w-4 ${loading ? 'animate-spin' : ''}`} />
              </Button>
            </div>
          </div>
        </CardHeader>
        <CardContent>
          {loading ? (
            <div className="flex items-center justify-center py-8">
              <RefreshCw className="h-6 w-6 animate-spin mr-2" />
              <span>加载中...</span>
            </div>
          ) : shareList.length === 0 ? (
            <div className="text-center py-8 text-gray-500">
              <Upload className="h-12 w-12 mx-auto mb-4 text-gray-300" />
              <p>暂无分享码数据</p>
              <p className="text-sm">请先导入一些分享码</p>
            </div>
          ) : (
            <div className="space-y-4">
              <ShareCodeTable
                shareList={shareList}
                onViewDetail={onViewDetail}
                onParse={onParse}
                onDelete={onDelete}
                onImportToVirtualDisk={onImportToVirtualDisk}
              />
              
              {/* 分页 */}
              {pagination.pages > 1 && (
                <div className="flex items-center justify-between">
                  <div className="text-sm text-gray-500">
                    共 {pagination.total} 条记录，第 {pagination.page} / {pagination.pages} 页
                  </div>
                  <div className="flex gap-2">
                    <Button
                      variant="outline"
                      size="sm"
                      disabled={!pagination.hasPrev}
                      onClick={() => onPageChange(pagination.page - 1)}
                    >
                      上一页
                    </Button>
                    <Button
                      variant="outline"
                      size="sm"
                      disabled={!pagination.hasNext}
                      onClick={() => onPageChange(pagination.page + 1)}
                    >
                      下一页
                    </Button>
                  </div>
                </div>
              )}
            </div>
          )}
        </CardContent>
      </Card>
    </div>
  );
}

export default ShareCodeList;